/**
 * MobX组件绑定通用模板
 * 各业务组件可以参考此模板实现与Store的绑定
 */

// 引入MobX绑定工具
const mobx = require('../../../../framework/mobx/mobx_wx.js');
const pageHelper = require('../../modules/research/helpers/page_helper.js');
const cloudHelper = require('../../../../helpers/cloud_helper.js');
const dataHelper = require('../../../../helpers/data_helper.js');
const timeHelper = require('../../../../helpers/time_helper.js');
const validate = require('../../../../helpers/validate.js');
const Day = require('../../../../framework/day/day.js');

// 示例Store导入 - 实际使用时替换为对应模块的Store
const TaskStore = require('../../../../store/task_store.js');

// 组件配置
Component({
  /**
   * 使用MobX绑定行为
   */
  behaviors: [mobx.storeBindingsBehavior],
  
  /**
   * 配置MobX绑定
   */
  storeBindings: {
    store: TaskStore,
    fields: {
      // 映射字段 - 示例
      taskCount: 'taskCount',         // 简单映射
      urgentTasks: 'urgentTasks',     // 简单映射
      completedRate: 'completedRate', // 简单映射
      pendingTaskCount: (store) => store.pendingTasks.length, // 计算映射
      hasUrgentTasks: (store) => store.urgentTasks.length > 0 // 计算映射
    },
    actions: {
      // 映射方法 - 示例
      addTask: 'addTask',
      removeTask: 'removeTask',
      updateTaskStatus: 'updateTaskStatus',
      filterTasks: 'filterTasks'
    }
  },

  /**
   * 组件选项
   */
  options: {
    // 启用全局样式类
    addGlobalClass: true,
    // 启用多插槽支持
    multipleSlots: true,
    // 组件样式隔离
    styleIsolation: 'isolated'
  },
  
  /**
   * 组件属性
   */
  properties: {
    // 组件显示模式
    mode: {
      type: String,
      value: 'default' // default, simple, card
    },
    
    // 数据过滤条件
    filter: {
      type: Object,
      value: {}
    },
    
    // 最大显示条目数
    limit: {
      type: Number,
      value: 5
    },
    
    // 是否自动加载数据
    autoLoad: {
      type: Boolean,
      value: true
    },
    
    // 标题文本
    title: {
      type: String,
      value: ''
    },
    
    // 是否显示更多按钮
    showMore: {
      type: Boolean,
      value: true
    },
    
    // 是否显示添加按钮
    showAdd: {
      type: Boolean,
      value: true
    },
    
    // 空状态文本
    emptyText: {
      type: String,
      value: '暂无数据'
    }
  },
  
  /**
   * 组件内部数据
   */
  data: {
    // UI状态
    isLoading: false,    // 加载状态
    isError: false,      // 错误状态
    errorMsg: '',        // 错误信息
    
    // 本地数据（经过处理的Store数据）
    displayItems: [],    // 展示的数据项
    hasMore: false       // 是否有更多数据
  },
  
  /**
   * 数据监听器
   */
  observers: {
    // 监听属性变化，重新处理数据
    'limit, filter, urgentTasks': function() {
      // 确保组件已初始化
      if (this.data.initDone) {
        this._processData();
      }
    }
  },
  
  /**
   * 组件生命周期
   */
  lifetimes: {
    /**
     * 组件创建时
     */
    created: function() {
      // 组件实例创建时执行
    },
    
    /**
     * 组件实例进入页面节点树时执行
     */
    attached: function() {
      // 初始化数据
      if (this.properties.autoLoad) {
        this._initData();
      }
    },
    
    /**
     * 组件在视图层布局完成后执行
     */
    ready: function() {
      this.setData({ initDone: true });
    },
    
    /**
     * 组件实例被移动到节点树另一个位置时执行
     */
    moved: function() {
      // 组件位置移动时
    },
    
    /**
     * 组件实例被从页面节点树移除时执行
     */
    detached: function() {
      // 组件销毁时的清理工作
      // 注意：不需要手动销毁storeBindings，behavior会自动处理
    }
  },
  
  /**
   * 组件所在页面的生命周期
   */
  pageLifetimes: {
    /**
     * 页面被展示时执行
     */
    show: function() {
      // 页面显示时，刷新数据
      if (this.properties.autoLoad && this.data.initDone) {
        this._processData();
      }
    },
    
    /**
     * 页面被隐藏时执行
     */
    hide: function() {
      // 页面隐藏时执行
    },
    
    /**
     * 页面尺寸变化时执行
     */
    resize: function(size) {
      // 页面尺寸变化时执行
    }
  },
  
  /**
   * 组件方法
   */
  methods: {
    /**
     * 初始化数据
     */
    _initData: function() {
      try {
        this.setData({ isLoading: true });
        
        // 处理数据
        this._processData();
        
        this.setData({ isLoading: false });
      } catch (err) {
        console.error('初始化数据失败', err);
        this.setData({
          isLoading: false,
          isError: true,
          errorMsg: '加载失败'
        });
      }
    },
    
    /**
     * 处理Store数据
     */
    _processData: function() {
      try {
        const { urgentTasks, filter, limit } = this.data;
        
        // 根据filter过滤数据
        let filteredItems = this.filterTasks ? this.filterTasks(filter) : urgentTasks;
        
        // 如果组件有自定义处理逻辑
        filteredItems = this._customDataProcess(filteredItems);
        
        // 根据limit限制数量
        const displayItems = filteredItems.slice(0, limit);
        
        // 使用Day.js处理日期时间
        displayItems.forEach(item => {
          if (item.TASK_ADD_TIME) {
            const addTime = Day(item.TASK_ADD_TIME);
            item.ADD_TIME_SHOW = addTime.format('YYYY-MM-DD HH:mm');
            item.ADD_TIME_AGO = addTime.fromNow();
          }
          
          if (item.TASK_DEADLINE) {
            const deadline = Day(item.TASK_DEADLINE);
            item.DEADLINE_SHOW = deadline.format('MM-DD HH:mm');
            
            // 计算剩余时间
            const now = Day();
            const diffDays = deadline.diff(now, 'day');
            const diffHours = deadline.diff(now, 'hour');
            
            item.DAYS_LEFT = diffDays;
            item.HOURS_LEFT = diffHours;
            item.IS_OVERDUE = diffDays < 0;
            item.IS_URGENT = diffDays === 0;
          }
        });
        
        // 更新组件数据
        this.setData({
          displayItems: displayItems,
          hasMore: filteredItems.length > limit
        });
        
        // 触发数据加载完成事件
        this.triggerEvent('dataload', {
          items: displayItems,
          total: filteredItems.length,
          hasMore: filteredItems.length > limit
        });
      } catch (err) {
        console.error('处理数据失败', err);
        this.setData({
          isError: true,
          errorMsg: '数据处理失败'
        });
      }
    },
    
    /**
     * 自定义数据处理（子类可覆盖）
     */
    _customDataProcess: function(items) {
      // 默认实现，子类可覆盖添加自定义逻辑
      return items;
    },
    
    /**
     * 刷新数据
     * 公开方法：外部可调用
     */
    refresh: function() {
      this._initData();
    },
    
    /**
     * 错误状态下重试
     */
    handleRetry: function() {
      this.setData({ 
        isError: false,
        errorMsg: ''
      });
      this._initData();
    },
    
    /**
     * 点击项目
     */
    handleItemTap: function(e) {
      const index = e.currentTarget.dataset.index;
      const item = this.data.displayItems[index];
      
      // 触发点击事件
      this.triggerEvent('itemtap', {
        item: item,
        index: index
      });
    },
    
    /**
     * 长按项目
     */
    handleItemLongTap: function(e) {
      const index = e.currentTarget.dataset.index;
      const item = this.data.displayItems[index];
      
      // 触发长按事件
      this.triggerEvent('itemlongtap', {
        item: item,
        index: index
      });
    },
    
    /**
     * 点击更多按钮
     */
    handleMoreTap: function() {
      // 触发查看更多事件
      this.triggerEvent('moretap');
    },
    
    /**
     * 点击添加按钮
     */
    handleAddTap: function() {
      // 触发添加事件
      this.triggerEvent('addtap');
    },
    
    /**
     * 更新任务状态
     */
    handleStatusChange: function(e) {
      try {
        const index = e.currentTarget.dataset.index;
        const item = this.data.displayItems[index];
        const currentStatus = item.TASK_STATUS;
        const newStatus = currentStatus === 0 ? 1 : 0;
        
        // 调用Store方法更新状态
        this.updateTaskStatus(item._id, newStatus);
        
        // 触发状态变更事件
        this.triggerEvent('statuschange', {
          id: item._id,
          oldStatus: currentStatus,
          newStatus: newStatus
        });
        
        // 更新本地显示
        setTimeout(() => {
          this._processData();
        }, 100);
        
        pageHelper.showSuccessToast('状态已更新');
      } catch (err) {
        console.error('更新状态失败', err);
        pageHelper.showModal('操作失败', '请稍后重试');
      }
    },
    
    /**
     * 删除任务
     */
    handleDeleteTap: async function(e) {
      try {
        const index = e.currentTarget.dataset.index;
        const item = this.data.displayItems[index];
        
        // 确认删除
        const confirm = await pageHelper.showConfirm('确认删除', '删除后不可恢复，是否继续？');
        if (!confirm) return;
        
        // 调用Store方法删除任务
        this.removeTask(item._id);
        
        // 触发删除事件
        this.triggerEvent('deletetap', {
          id: item._id,
          item: item
        });
        
        // 更新本地显示
        setTimeout(() => {
          this._processData();
        }, 100);
        
        pageHelper.showSuccessToast('删除成功');
      } catch (err) {
        console.error('删除失败', err);
        pageHelper.showModal('删除失败', '请稍后重试');
      }
    }
  }
}); 